<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>服务方入驻</title>
    <link rel="icon shortcut" type="image/x-icon" href="../../img/common/favicon.ico"/>
    <link rel="stylesheet" type="text/css" href="https://at.alicdn.com/t/font_357896_h659h7bkkvbr19k9.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/common/applycommon.css" />
    <link rel="stylesheet" type="text/css" href="../../css/case-add.css"/>
    <script src="../../js/viewport.js" ></script>
</head>
<body>
	<main class="main">
		<div class="container">
			<!--案例信息 start-->
			<section class="case-section case-infor">
				<h3 class="section-title">
					<span>1</span>案例信息
				</h3>
				<div class="section-item">
					<p class="item-title">案例名称<i class="red">*</i></p>
					<input class="item-input" type="text" id="case-name" value="" placeholder="请输入案例名称" />
				</div>
				<div class="section-item">
					<p class="item-title">品类<i class="red">*</i></p>
					<a class="addbtn catebtn">选择品类</a>
				</div>
				<div class="section-item">
					<p class="item-title">设计时间<i class="red">*</i></p>
					<input class="item-input" type="date" id="case-datetime" value="" placeholder="请选择" />
				</div>
				<div class="section-item">
					<p class="item-title">封面图<i class="red">*</i></p>
					<a class="addbtn catebtn"><i class="iconfont icon-icon-add"></i>上传封面图</a>
					<div class="img-wrapper">
                        <img src="../../img/apply/company-case.png" alt="">
                        <a class="img-shade"><i class="iconfont icon-icon-delete"></i></a>
                    </div>
				</div>
				<div class="section-item">
					<p class="item-title">详情图<i class="red">*</i></p>
					<a class="addbtn catebtn"><i class="iconfont icon-icon-add"></i>上传详情图</a>
					<ul class="img-list clearfix">
						<li class="img-wrapper">
	                        <img src="../../img/apply/company-case.png" alt="">
	                        <a class="img-shade"><i class="iconfont icon-icon-delete"></i></a>
	                    </li>
	                    <li class="img-wrapper">
	                        <img src="../../img/apply/company-case.png" alt="">
	                        <a class="img-shade"><i class="iconfont icon-icon-delete"></i></a>
	                    </li>
	                    <li class="img-wrapper">
	                        <img src="../../img/apply/company-case.png" alt="">
	                        <a class="img-shade"><i class="iconfont icon-icon-delete"></i></a>
	                    </li>
	                    <li class="img-wrapper">
	                        <img src="../../img/apply/company-case.png" alt="">
	                        <a class="img-shade"><i class="iconfont icon-icon-delete"></i></a>
	                    </li>
					</ul>
				</div>
				<div class="section-item item-state">
					<p class="item-title">案例描述</p>
					<textarea placeholder="请输入案例描述..."></textarea>
				</div>
			</section>
			<!--案例信息 end-->
			<!--案例标签 start-->
			<section class="case-section case-label">
				<h3 class="section-title">
					<span>2</span>案例标签
				</h3>
				<div class="section-item">
					<p class="item-title">产品定位</p>
					<ul class="form-checkbox">
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="check1">
							<label for="check1">高端</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="check2">
							<label for="check2">中高端</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="check3">
							<label for="check3">中端</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="check4">
							<label for="check4">中低端</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="check5">
							<label for="check5">低端</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
					</ul>
				</div>
				<!-- 销售区域 start -->
				<div class="section-item">
					<p class="item-title">销售区域</p>
					<ul class="form-checkbox">
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="scheck1">
							<label for="scheck1">内销</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="scheck2">
							<label for="scheck2">西欧</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="scheck3">
							<label for="scheck3">东欧</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="scheck4">
							<label for="scheck4">南欧</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="scheck5">
							<label for="scheck5">其他</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
					</ul>
				</div>
				<!-- 销售区域 end -->
				<!-- 主要材质 start -->
				<div class="section-item">
					<p class="item-title">主要材质</p>
					<ul class="form-checkbox">
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="tcheck1">
							<label for="tcheck1">塑料</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="tcheck2">
							<label for="tcheck2">不锈钢</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="tcheck3">
							<label for="tcheck3">钣金</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="tcheck4">
							<label for="tcheck4">镀铬件</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="tcheck5">
							<label for="tcheck5">陶瓷</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="tcheck6">
							<label for="tcheck6">PMAA（有机玻璃）</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-other">
							<input class="otherinput" type="text" value="" placeholder="其他请补充" />
						</li>
					</ul>
				</div>	
				<!-- 主要材质 end -->
				<!-- 控制方式 start -->
				<div class="section-item">
					<p class="item-title">控制方式</p>
					<ul class="form-checkbox">
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="fcheck">
							<label for="fcheck4">电子</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="fcheck1" />
							<label for="fcheck1">触摸</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="fcheck2" />
							<label for="fcheck2">机械</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="fcheck3" />
							<label for="fcheck3">手机控制</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-other">
							<input class="otherinput" type="text" value="" placeholder="其他请补充" />
						</li>
					</ul>
				</div>	
				<!-- 控制方式 end -->
				<!-- 产品风格 start -->
				<div class="section-item">
					<p class="item-title">产品风格</p>
					<ul class="form-checkbox">
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="stylecheck1" />
							<label for="stylecheck1">日韩</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="stylecheck2" />
							<label for="stylecheck2">欧式</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="stylecheck3" />
							<label for="stylecheck3">美式</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="stylecheck4" />
							<label for="stylecheck4">中式</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="stylecheck5" />
							<label for="stylecheck5">东南亚</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="stylecheck6" />
							<label for="stylecheck6">中东</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
					</ul>
				</div>
				<!-- 产品风格 end -->
				<!-- 产品属性 start -->
				<div class="section-item">
					<p class="item-title">产品属性</p>
					<ul class="form-checkbox">
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="pcheck1" />
							<label for="pcheck1">科技感强</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="pcheck2" />
							<label for="pcheck2">高端简洁</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="pcheck3" />
							<label for="pcheck3">控制成本</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="pcheck4" />
							<label for="pcheck4">智能</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
					</ul>
				</div>
				<!-- 产品属性 end -->
				<!-- 适用人群 start -->
				<div class="section-item">
					<p class="item-title">适用人群</p>
					<ul class="form-checkbox">
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="lastcheck1" />
							<label for="lastcheck1">母婴类</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="lastcheck2" />
							<label for="lastcheck2">儿童类</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="lastcheck3" />
							<label for="lastcheck3">女性</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="lastcheck4" />
							<label for="lastcheck4">青年类</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="lastcheck5" />
							<label for="lastcheck5">老年类</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="lastcheck6" />
							<label for="lastcheck6">居家人群</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="lastcheck7" />
							<label for="lastcheck7">职场人群</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="lastcheck8" />
							<label for="lastcheck8">户外人群</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-other">
							<input class="otherinput" type="text" value="" placeholder="其他请补充" />
						</li>
					</ul>
				</div>
				<!-- 适用人群 end -->
				<!--div.section-item>p.item-title+ul.form-checkbox-->
				<!--(li.check-wrapper>input.input_check[type="checkbox"]#fcheck$+label[for="fcheck$"]+i.iconfont.icon-icon-complete)*3-->
			</section>
			<!--案例标签 end-->
			<!--获得奖项 start-->
			<section class="case-section case-awards">
				<h3 class="section-title">
					<span>3</span>获得奖项
				</h3>
            	<a class="award-addbtn"><i class="iconfont icon-icon-add"></i>添加案例</a>
            	<ul class="award-list">
            		<li class="award-li">
            			<div class="award-img"><img src="../../img/apply/company-case.png"/></div>
            			<span class="award-name">2018IDEA奖</span>
            			<a class="delbtn iconfont icon-icon-delete" title="删除"></a>
            		</li>
            		<li class="award-li">
            			<div class="award-img">
            				<img src="../../img/apply/company-case.png"/>
            			</div>
            			<span class="award-name">2018IDEA奖</span>
            			<a class="delbtn iconfont icon-icon-delete" title="删除"></a>
            		</li>
            	</ul>
			</section>
			<!--获得奖项 end-->
			<!--更多信息 start-->
			<section class="case-section case-moreinfor">
				<h3 class="section-title">
					<span>4</span>更多信息
				</h3>
				<div class="section-item">
					<p class="item-title">设计方案</p>
					<ul class="form-checkbox">
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="model-apper" />
							<label for="model-apper">外观设计</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
						<li class="check-wrapper">
							<input type="checkbox" class="input_check" id="model-struct" />
							<label for="model-struct">结构设计</label>
							<i class="iconfont icon-icon-complete"></i>
						</li>
					</ul>
				</div>
				<div class="section-item">
					<p class="item-title">完成周期</p>
					<input type="number" class="textinput" placeholder="请输入完成周期（数字）" />
				</div>
				<div class="section-item">
					<p class="item-title">合作客户</p>
					<input type="text" class="textinput" placeholder="请输入产品所属的客户名称" />
				</div>
				<div class="section-item">
					<p class="item-title">案例费用</p>
					<input type="number" class="textinput" placeholder="请输入案例的制作费用（数字）" />
				</div>
				<div class="item-nopublic">
					<div class="checkbox-wrapper">
						<input type="checkbox" id="nopublic" value="" />
						<label class="checkbox-label" for="nopublic">
							<span class="checkbox-check"></span>
							<span class="checkbox-check-text">不公开</span>
						</label>
					</div>
					<p>仅来设计内部可见，用于匹配需求，且对需求方不可见</p>
				</div>
			</section>
			<!--更多信息 end -->
		</div>
	</main>
	<footer class="site-footer">
        <div class="container">
            <a class="footerbtn halfbtn borderbtn fl">上一步</a>
            <button class="footerbtn halfbtn graybtn fr">提交审核</button>
        </div>
	</footer>
</body>
<script src="../../js/jquery.min.js"></script>
<script src="../../js/applycommon.js" ></script>
<script>
	$('.check-wrapper label').on('click',function(){
		$(this).parent().toggleClass('checked');
	});
	$('.checkbox-wrapper label').on('click',function(){
		$(this).parent().toggleClass('checked');
	});
</script>
</html>
